<template>
	<view
		class="notice_con"
		@click="
			navSwitch('/pages/index/noticeDetails/index?domainPrefix=' + store)
		"
	>
		<u-gap height="8"></u-gap>
		<view class="body">
			<view class="title">{{$t('locales.notice')}}</view>
			<u-notice-bar
				class="body"
				padding="18rpx 12rpx 18rpx 0rpx "
				font-size="24"
				mode="vertical"
				:volume-icon="false"
				type="none"
				:list="list"
			></u-notice-bar>
			<u-icon name="arrow-right" color="#999" size="18"></u-icon>
		</view>
		<u-gap height="8"></u-gap>
	</view>
</template>

<script>
export default {
	props: {
		value: {
			type: Array,
			default: () => []
		},
	},
	watch: {
		value(val) {
			val.map(item => {
				this.list.push(item.content)
			})
		}
	},
	data() {
		return {
			list: [],
			store: this.$store.getters.domainPrefix
		}
	},
	methods: {
		navSwitch(url) {
			uni.navigateTo({
				url
			})
		}
	}
}
</script>

<style lang="scss">
.notice_con {
	.body {
		margin: 0 24rpx;
		height: 68rpx;
		border-radius: 16rpx;
		background-color: #ffffff;
		display: flex;
		align-items: center;
		padding-right: 10rpx;
		box-sizing: border-box;
		.title {
			margin-left: 20rpx;
			font-weight: 700;
			// font-style: italic;
			font-size: 29rpx;
		}
		.body {
			flex: 1;
		}
	}
}
</style>
